<template>
  <div class="app-container">
    <div class="container">
      <div class="main page page-list">
        <div class="head-container">
           <!-- tab -->
           <div class="m-b-8">
          <el-radio-group v-model="type" size="small">
          <el-radio-button label="1">统计汇总</el-radio-button>
          <el-radio-button label="2">日统计</el-radio-button>
          </el-radio-group>
            </div>
          <el-card shadow="never">
            <!--  -->
            <div class="search-bar pd">
              <el-form
                :inline="true"
                :model="searchModel"
                size="mini"
                class="demo-form-inline"
              >
                <el-form-item label="日期">
                  <el-date-picker
                    v-model="searchModel.day"
                    type="daterange"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                    value-format='yyyy-MM-dd '
                  >
                  </el-date-picker>
                </el-form-item>              

                <el-form-item label="月份" class="m-l-8">
                  <el-date-picker
                    v-model="searchModel.yearMonth"
                    type="month"
                    value-format="yyyy-MM"
                    placeholder="选择月份"
                  >
                  </el-date-picker>
                </el-form-item>

                <el-form-item class="operations">
                  <el-button
                    type="primary"
                    @click="search"
                  >查询</el-button>


                  <el-button
                    type="default"
                    @click="reset"
                  >重置</el-button>
                </el-form-item>
              </el-form>
            </div>
          </el-card>
        </div>

        <div v-if="type ==='1'">
          <el-card
            shadow="never"
            v-loading="sumLoading"
            class="m-b-8"
          >
            <div class="sumBox2">
              <div class="sumItem">
                <span>合计服务费充值</span><span class="text-bold-18 text-success">{{ (sumData.rechargeAmount + sumData.reverseRechargeAmount) / 100 }} 元</span>
              </div>
              <div class="sumItem">
                <span>合计预估充值手续费</span><span class="text-bold-18 text-success">{{ sumData.estimateChargeCost }} 元</span>
              </div>
             
            </div>

            <div class="sumBox2">
              <div class="sumItem">
                <span>合计成功转账金额</span><span class="text-bold-18 text-success">{{ (sumData.successAmount + sumData.safePaySuccessAmount).toFixed(2) }} 元</span>
                <div>
                  <span class="m-r-8">P:</span>
                <span>{{ sumData.successAmount }}</span>
                </div>
                <div>
                  <span class="m-r-8">A:</span>
                  <span >{{ sumData.safePaySuccessAmount }}</span>
                </div>
               
              </div>
              <div class="sumItem">
                <span>合计成功转账笔数</span><span class="text-bold-18 text-success">{{ sumData.successCount + sumData.safePaySuccessCount }} 笔</span>
                <div>
                  <span class="m-r-8">P:</span>
                  <span>{{ sumData.successCount }}</span>
                </div>
                <div>
                  <span class="m-r-8">A:</span>
                  <span>{{ sumData.safePaySuccessCount }}</span>
                </div>
               
              </div>

            </div>
             
            <div class="sumBox2">
              <div class="sumItem">
                <span>合计服务费收入（商户支出）</span><span class="text-bold-18 text-success">{{ (sumData.successServicePrice + sumData.safePaySuccessServicePrice) / 100 }} 元</span>
                <div>
                  <span class="m-r-8">P:</span>
                  <span>{{ sumData.successServicePrice / 100 }}</span>
                </div>
                <div>
                  <span class="m-r-8">A:</span>
                  <span>{{ sumData.safePaySuccessServicePrice / 100 }}</span>
                </div>
                
              </div>
              <div class="sumItem">
                <span>合计预估成本（充值+下发）</span><span class="text-bold-18 text-success">{{ sumData.estimateTotalCost }} 元</span>
                <div>
                  <span class="m-r-8">C:</span>
                  <span>{{ sumData.estimateChargeCost }}</span>
                </div>
               <div>
                <span class="m-r-8">K:</span>
                <span>{{ sumData.estimateBankCost }}</span>
               </div>
               
              </div>

            </div>

            <div class="sumBox">
              <div class="sumItem">
                <span>合计平台收益</span><span class="text-bold-18 text-success">{{ ((sumData.totalPlatformBenefit + sumData.safePayTotalPlatformBenefit ) / 100 - sumData.estimateTotalCost).toFixed(2) }} 元</span>
                <!-- <div>
                  <span class="m-r-8">P:</span>
                  <span>{{ sumData.totalPlatformBenefit / 100 }}</span>
                </div>
               <div>
                <span class="m-r-8">A:</span>
                <span>{{ sumData.safePayTotalPlatformBenefit / 100 }}</span>
               </div> -->
              
              </div>
              <div class="sumItem">
                <span>合计渠道（合伙人）收益</span><span class="text-bold-18 text-success">{{ (sumData.totalPartnerBenefit + sumData.totalFatherPartnerBenefit + sumData.safePayTotalPartnerBenefit + sumData.safePayTotalFatherPartnerBenefit) / 100 }} 元</span>
                <div>
                  <span class="m-r-8">P:</span>
                  <span>{{ (sumData.totalPartnerBenefit + sumData.totalFatherPartnerBenefit) / 100 }}</span>
                </div>
               <div>
                <span class="m-r-8">A:</span>
                <span>{{ (sumData.safePayTotalPartnerBenefit + sumData.safePayTotalFatherPartnerBenefit) / 100 }}</span>
               </div>
               
              </div>
              <div class="sumItem" v-if="!searchModel.day">
                <span>合计员工提成收益</span><span class="text-bold-18 text-success">{{ sumData.partnerInsiderBenefit }} 元</span>       
              </div>
            </div>

            <div class="sumBox2">
              <div class="sumItem">
                <span>合计服务费提现</span><span class="text-bold-18 text-danger">{{ -sumData.userWithdrawAmount / 100 }} 元</span>
              </div>
    
              <div class="sumItem">
                <span>合计渠道（合伙人）收益提现</span><span class="text-bold-18 text-danger">{{ -sumData.partnerWithdrawAmount / 100 }} 元</span>
              </div>
            </div>


          </el-card>
        </div>
        <!-- 日统计 -->

        <div class="data-list-wrap" v-if="type ==='2'">
          <el-card shadow="never">
            <el-table
              v-loading="loading"
              :data="list"
              size="small"
              style="width: 100%;"
            >
              <el-table-column
                prop="day"
                label="日期"
              >
              </el-table-column>

              <el-table-column label="合计服务费充值">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ (scope.row.rechargeAmount + scope.row.reverseRechargeAmount) / 100 }}
                  </div>
                </template>
              </el-table-column> 

              <el-table-column label="合计预估充值手续费">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ scope.row.estimateChargeCost }}
                  </div>
                </template>
              </el-table-column>

              <el-table-column label="合计成功转账笔数">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ scope.row.successCount + scope.row.safePaySuccessCount }}
                  </div>
                  <div>
                    P: {{ scope.row.successCount }}
                  </div>
                  <div>
                    A: {{ scope.row.safePaySuccessCount }}
                  </div>
                </template>
              </el-table-column>

              <el-table-column label="合计成功转账金额">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ (scope.row.successAmount + scope.row.safePaySuccessAmount).toFixed(2) }}
                  </div>
                  <div>
                    P: {{ scope.row.successAmount }}
                  </div>
                  <div>
                    A: {{ scope.row.safePaySuccessAmount }}
                  </div>
                </template>
              </el-table-column>

              <el-table-column label="服务费提现">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ scope.row.userWithdrawAmount / 100 }}
                  </div>
                </template>
              </el-table-column>

  

              <el-table-column label="合计服务费收入（商户支出）">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ (scope.row.successServicePrice + scope.row.safePaySuccessServicePrice) / 100 }}
                  </div>
                  <div>
                    P: {{ scope.row.successServicePrice / 100 }}
                  </div>
                  <div>
                    A: {{ scope.row.safePaySuccessServicePrice / 100 }}
                  </div>
                </template>
              </el-table-column>

              
              <el-table-column label="合计预估成本（充值 + 下发）">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ scope.row.estimateTotalCost }}
                  </div>
                  <div>
                    C: {{ scope.row.estimateChargeCost }}
                  </div>
                  <div>
                    K: {{ scope.row.estimateBankCost  }}
                  </div>
                </template>
              </el-table-column>

              <el-table-column label="合计平台收益">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ ((scope.row.totalPlatformBenefit + scope.row.safePayTotalPlatformBenefit) / 100 - scope.row.estimateTotalCost).toFixed(2) }}
                  </div>
                </template>
              </el-table-column>

              <el-table-column label="合计平台收益费率">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ scope.row.totalPlatformBenefitRatio ? (scope.row.totalPlatformBenefitRatio * 100).toFixed(2) + '%' : '0%' }}
                  </div>
                </template>
              </el-table-column>

              <el-table-column label="合计商户平均费率">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ scope.row.totalAverageRatio  ? (scope.row.totalAverageRatio * 100).toFixed(2) + '%' : '0%' }}
                  </div>
                </template>
              </el-table-column>


              <el-table-column label="合计渠道（合伙人）收益">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ (scope.row.totalPartnerBenefit + scope.row.totalFatherPartnerBenefit + scope.row.safePayTotalPartnerBenefit + scope.row.safePayTotalFatherPartnerBenefit )  / 100 }}
                  </div>
                  <div>
                    P: {{ (scope.row.totalPartnerBenefit + scope.row.totalFatherPartnerBenefit)  / 100 }}
                  </div>
                  <div>
                    A: {{ (scope.row.safePayTotalPartnerBenefit + scope.row.safePayTotalFatherPartnerBenefit)  / 100 }}
                  </div>
                </template>
              </el-table-column>


              <el-table-column label="合计服务费提现">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ scope.row.userWithdrawAmount / 100 }}
                  </div>
                </template>
              </el-table-column>

              <el-table-column label="合计渠道（合伙人）提现">
                <template slot-scope="scope">
                  <div class="text-bold-18">
                    {{ scope.row.partnerWithdrawAmount / 100 }}
                  </div>
                </template>
              </el-table-column>


            </el-table>
            <div class="paging-wrap">
              <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="searchModel.pageNo"
                :page-sizes="[10, 20, 50, 100]"
                :page-size="searchModel.pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="searchModel.count"
              >
              </el-pagination>
            </div>
          </el-card>
        </div>

      </div>
    </div>
  </div>
</template>


<script>
import {
  searchCompanyBillDailyStat,
  sumCompanyBillDailyStat,
} from "@/api/business";
const defaultModel = {
  pageNo: 1,
  pageSize: 10,
  count: 0,
};
export default {
  data() {
    return {
      type:"1", // 统计汇总 1  && 日统计 2
      searchModel: _.cloneDeep(defaultModel),
      list: [],
      loading: false,
      curData: null,

      sumData: {}, //合计数据
      sumLoading: false,
    };
  },
  components: {},
  methods: {
    search() {
      this.getList(1);
      this.sumCompanyBillDailyStat();
    },

    sumCompanyBillDailyStat() {
      this.sumLoading = true;
      let searchModel = _.cloneDeep(this.searchModel);
      sumCompanyBillDailyStat(this.compileSearchModel(searchModel))
        .then((data) => {
          this.sumData = data.data;
          this.sumLoading = false;
        })
        .catch((err) => {
          console.log(err);
        });
    },

    getList(pageNo) {
      var self = this;
      this.loading = true;
      if (pageNo != undefined) {
        this.searchModel.pageNo = pageNo;
      }

      let searchModel = _.cloneDeep(this.searchModel);
      searchCompanyBillDailyStat(this.compileSearchModel(searchModel))
        .then((data) => {
          self.searchModel.pageNo = ++data.pageNo;
          self.searchModel.count = data.count;
          self.searchModel.pageSize = data.pageSize;
          self.list = data.data;
          self.loading = false;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    reset() {
      this.searchModel = _.cloneDeep(defaultModel);
      this.getList(1);
    },
    compileSearchModel(searchModel) {
      searchModel.pageNo = searchModel.pageNo - 1;

      if (searchModel.day && searchModel.day.length > 0) {
        searchModel.startDay = searchModel.day[0];
        searchModel.endDay = searchModel.day[1];
      }

      delete searchModel.day;

      if (searchModel.yearMonth) {
        let yearMonth = searchModel.yearMonth.split("-");
        searchModel["year"] = yearMonth[0];
        searchModel["month"] = yearMonth[1];
      }

      delete searchModel.yearMonth;

      return searchModel;
    },
    //修改分页
    handleSizeChange(val) {
      this.searchModel.pageSize = val;
      this.getList(1);
    },
    //修改页面
    handleCurrentChange(val) {
      this.getList(val);
    },
    init() {
      this.search();
    },

    // 跳转到充值中心下的充值记录
    jumpToVoucherCenter() {
       this.$router.push({ path: '/chargeCenter/chargeRecord?from=daily'})
    }
  },
  mounted() {
    this.init();
  },
};
</script>

<style lang="scss" scoped>
.sumBox2{
  display: grid;
  grid-template-columns: repeat(3, 33%);
  padding: 2px;
  margin-bottom: 8px;
}
.sumBox {
  display: grid;
  grid-template-columns: repeat(4, 25%);
  padding: 2px;
  margin-bottom: 8px;
}
.sumItem {
    border: 1px solid #fff;
    display: flex;
    flex-direction: column;
    margin-right: 16px;
    justify-content: space-around;
    align-items: center;
    height: 120px;
    background: #eeeeee;
    padding: 10px;
    box-sizing: border-box;
  }
</style>
